﻿<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="ViewPage<CustomerViewData>" %>
<%@ Import Namespace="Mvc.XForms.Utilities"%>
<asp:Content ContentPlaceHolderID="Content" runat="server">

<% Html.XForm(Model.Customer).Form(form => { %>

<fieldset>
	<legend>Personal</legend>
	<%-- A basic input with example of onclick --%>
	<%= form.Input(c => c.IsActive)
		.Action(XFormEvent.DOMActivate, "helloWorld") %>
	
	<%-- An example of overriding the default label --%>
	<%= form.Input(c => c.Name)
		.Label("Customer Name") %>
		
	<%-- Date field; notice no need to specify that, it works from the datatype --%>
	<%= form.Input(c => c.DateOfBirth) %>
	
	<%-- A select1 with optional text for the null option --%>
	<%= form.Select1(c => c.Faction)
		.Nullable("Select a faction...")
		.SelectNullForEmptyRequest(!Model.IsEditing) %>
	
	<%-- The address could be a group: --%>
	<%-- form.Group(c => c.Address).Template(address => { %>
		<%= address.Hidden(a => a.ID) %>
		<%= address.Input(a => a.Address1).Label("Address")%>
		<%= address.Input(a => a.Address2).Label("")%>
		<%= address.Select1(a => a.Planet, Model.Planets, p => p.ID, p => p.Name).Appearance(Appearance.Full)%>
	<% }); --%>
	
	<%-- Or a partial view: --%>
	<% form.Partial(c => c.Address).Render(); %>
	
	<%-- A multiple select --%>
	<%= form.Select(c => c.MailingLists, Model.MailingLists, m => m.ID, m => m.Name)
		.Appearance(Appearance.Minimal) %>
</fieldset>

<fieldset>
	<legend>Orders</legend>
	<%= form.Trigger("AddOrder").Label("Add Order")
		.Insert(i => i.Nodeset(c => c.Orders).At(At.Last))%>
	<% form.Repeat(c => c.Orders)
		.Action(XFormEvent.Insert, "onOrderInsert")	
		.ItemTemplate(orders => { %>
		<%= orders.Input(o => o.Reference) %>
		<%= orders.Trigger("Del").Label("Delete Order").Appearance(Appearance.Minimal).Delete()%>
		<%= orders.Trigger("AddProduct").Label("Add Product")
			.Insert(i => i.Nodeset(o => o.Products).At(At.Last)) %>
		<% orders.Repeat(o => o.Products)
			.Action(XFormEvent.Insert, "onProductInsert")
			.ItemTemplate(products => { %>
			<%= products.Input(p => p.Name) %>
			<%= products.Input(p => p.Price) %>
			<%= products.Trigger("Del").Label("Delete Product").Delete() %>
		<% }); %>
	<% }); %>
</fieldset>

<fieldset>
	<legend>Notes</legend>
	<%= form.Trigger("addNote")
		.Insert(i => i.Nodeset(c => c.Notes).At(At.Last))
		.Label("Add Note")%>
	<% form.Repeat(c => c.Notes)
		.DefaultItem("Customer note...")
		.ItemTemplate(notes => { %>
			<%= notes.TextArea(c => c)
				.Rows(4)
				.Columns(50)	%>
			<%= notes.Trigger("del").Label("x").Delete()%>
	<% }); %>
</fieldset>

<%= form.Trigger("Submit").Label("Save customer").Send() %>

<% }); %>

<script type="text/javascript">
function helloWorld(ev) {
	alert('Hello');
}

function onOrderInsert(ev, item, index, position) {
	$(item).find('input:first').val('Product ' + item.xforms.itemIndex);
}

function onProductInsert(ev, item, index, position) {
	$(item).find('input:first').val('Order ' + item.xforms.itemIndex);
}
</script>

</asp:Content>